.netCHARTING v10.5 Documentation
Chart Type Anatomy 101

Introduction

Chart types are constructed using several settings. Among them, the most significant are:

These properties work in concert to provide unprecedented flexibility. 

Chart Types

The most fundamental property, Chart.Type, determines the generic layout of series and in the case of pie, and radar, a type of chart. Axis scales further contribute to how elements are laid out, i.e. (Stacked). The series type determines how the series are drawn (line, bar, etc.).

[C#]

Chart.Type = ChartType.Radar;

[Visual Basic]

Chart.Type = ChartType.Radar
Show All
Hide All

 

Combo

Combo Chart Type

This chart type supports all the series types. It is vertically oriented so the y axis (value axis) can only contain numeric or time values while the x axis can also contain names of elements (category axis).


Supported Series Types

  • All


 Element values (properties) used on the (Y Axis).

  • YValue
  • YValueStart
  • YDateTime
  • YDateTimeStart
  • BubbleSize
  • Complete
  • (Financial: Open Close High Low)


  Element values used on the (X Axis).

  • XValue
  • XDateTime
  • Name 

 

ComboHorizontal

 

ComboHorizontal Chart Type

This chart types is horizontally oriented so the x axis can only contain numeric or time values. It is the same as the Combo type except it's oriented horizontally.


Supported Series Types

  • All (New in version 3.4)

 

Notice the X and Y properties are switched
  Element values used on the (Y Axis).

  • XValue
  • XDateTime
  • Name 


 Element values used on the (X Axis).

  • YValue
  • YValueStart
  • YDateTime
  • YDateTimeStart
  • BubbleSize
  • Complete
  • Element.Parent  (Gantt Dependencies)
  • Element.InstanceID (Gantt Dependencies)
  • Element.ParentID (Gantt Dependencies)
  • (Financial: Open Close High Low)

 

Notice that the axes element values are reversed for this chart type, meaning the element XValue actually goes on the Y axis. The reason for this is so that if you change between vertical and horizontal chart types, the result will be the same.

 

 

ComboSideBySide

ComboSideBySide Chart Type

This chart type is similar to combo but series are placed side by side and the x axis tick labels show series names instead of element names. This layout can be achieved in a normal combo chart by transposing the data.


Supported Series Types

  • All


  Element values used on the (Y Axis).

  • YValue
  • YValueStart
  • YDateTime
  • YDateTimeStart
  • BubbleSize
  • Complete
  • (Financial: Open Close High Low)


  Element values used on the (X Axis).

  • None (Series.Name us used)

 

Notes


 

Pie & Donut

Pie Chart Type

Shows a single pie consisting of all the series added to the chart where each slice represents a series.


Supported Series Types

  • N/A


  Element values used on the (Y Axis).

  • YValue


 Element values used on the (X Axis).

  • N/A


 Related properties:

  • Element.ForceMarker
  • Element.ExplodeSlice
  • Chart.PieLabelMode
  • Chart.ExplodedSliceAmount
  • Chart.DonutHoleSize (Donut Only)
  • Chart.XAxis.OrientationAngle

 

Notice that the series are slices when using this chart type, hence, if only a single series is used, the chart will have a single 100% slice. To see each element use the plural ChartType.Pies.
 

 

PiesNested

PiesNested Chart Type

Shows a series of nested pies.

 

Scale.Stacked
The width of each ring can also reflect the series total values when Chart.YAxis.Scale = Scale.Stacked is used. Alternatively Series.DefaultElement.BubbleSize can be used to specify ring widths and will be applied when these properties are set.

Scale.Normal
When Scale.Normal is used, the pies are not stacked, the ring width of each pie is measured from the middle point of the pies. This means that if two series have the same ring width, one will completely cover the other.

In this mode, SpacingPercentageNested is not applicable.


Supported Series Types

  • N/A


  Element values used on the (Y Axis).

  • YValue
  • Series.DefaultElement.BubbleSize (Control ring widths).


 Element values used on the (X Axis).

  • N/A


 Related properties:

  • Element.ForceMarker
  • Chart.SpacingPercentageNested
  • Chart.PieLabelMode

 

 

Radar

Radar Chart Type

Draws all series on a single radar. Both x and y axes are used. The x axis surrounds the radar and the y axis goes from the center to the outside.

Using this type will force each series to share a single x axis.
Supported Series Types
  • Marker
  • Line
  • AreaLine
  • Bubble
  • Column


  Element values used on the (Y Axis).

  • YValue
  • YValueStart
  • YDateTime
  • YDateTimeStart
  • BubbleSize


 Element values used on the (X Axis).

  • Name
  • XValue
  • XDateTime


 Related properties:

  • Chart.RadarLabelMode
  • Axis.RadarMode
  • Chart.XAxis.OrientationAngle
Polar Charts
The radar chart can support standard spider and polar axes. If the x axis uses a category scale, the default will be a spider axis (resembling a spider web). If the axis uses a numeric or time axis, the type will default to Polar. The type can also be specified explicitly using: 
[C#]
Chart.XAxis.RadarMode = RadarMode.Polar;

[Visual Basic]
Chart.XAxis.RadarMode = RadarMode.Polar
Lines on polar charts will appear as curves. This is a feature which helps determine the actual values of lines along along the width of the lines.

 

MultipleGrouped

MultipleGrouped Chart Type

Draws all series as elements of a single object such as types specified by SeriesTypeMultiple.

Supported Series Types (SeriesTypeMultiple)
  • FunnelCone
  • FunnelPyramid
  • Pyramid
  • Cone
  • Pie
  • Donut
  • Gauge
  • StackedBubble (Uses Element.YValue, not Element.BubbleSize)


  Element values used on the (Y Axis).

  • YValue


 Related properties:

  • Chart.FunnelNozzlePercentage
  • Chart.FunnelNozzleWidthPercentage
  • Chart.SpacingPercentage
  • Chart.BubbleStackShadeAsOne
  • Chart.BubbleCenterStack

Gauges

Gauges Chart Type

Shows each series as a gauge. Each can be a different GaugeType.

 

Please refer to the Gauges Tutorial for detailed documentation.

 

Donuts

Donuts Chart Type

The series are laid out in a way that allows for the maximum space usage. One donut for each series.


Supported Series Types
  • N/A


  Element values used on the (Y Axis).

  • YValue
  • Height (2D Only)


 Element values used on the (X Axis).

  • N/A

 

 Related properties:

  • Element.ForceMarker
  • Element.ExplodeSlice
  • Chart.PieLabelMode
  • Chart.ExplodedSliceAmount
  • Chart.DonutHoleSize
  • Chart.XAxis.OrientationAngle
  • Element.Outline

 

Radars

Radars Chart Type

Shows a radar for each series in the chart.

 

Supported Series Types
  • Marker
  • Line
  • AreaLine
  • Bubble
  • Column


  Element values used on the (Y Axis).

  • YValue
  • YValueStart
  • YDateTime
  • YDateTimeStart
  • BubbleSize


 Element values used on the (X Axis).

  • Name
  • XValue
  • XDateTime


 Related properties:

  • Chart.RadarLabelMode
  • Axis.RadarMode
  • Chart.XAxis.OrientationAngle
Polar Charts
The radar chart can support standard spider and polar axes. If the x axis uses a category scale, the default will be a spider axis (resembling a spider web). If the axis uses a numeric or time axis, the type will default to Polar. The type can also be specified explicitly using: 
[C#]
Chart.XAxis.RadarMode = RadarMode.Polar;

[Visual Basic]
Chart.XAxis.RadarMode = RadarMode.Polar
Lines on polar charts will appear as curves. This is a feature which helps determine the actual values of lines along along the width of the lines.

 

Multiple

Multiple Chart Type

Draws all series as individual objects. Different types are supported and can be specified by SeriesTypeMultiple for each series simultaneously. The benefit of this chart type is that it allows using different types such as pies, gauges, and the multiple types all on the same chart.

Supported Series Types (SeriesTypeMultiple)
  • FunnelCone
  • FunnelPyramid
  • Pyramid
  • Cone
  • Pie
  • Donut
  • Gauge
  • StackedBubble (Uses Element.YValue, not Element.BubbleSize)


  Element values used on the (Y Axis).

  • YValue


 Related properties:

  • Chart.FunnelNozzlePercentage
  • Chart.FunnelNozzleWidthPercentage
  • Chart.StackedSpacingPercentage
  • Chart.BubbleStackShadeAsOne
  • Chart.BubbleCenterStack

 

Pies

Pies Chart Type

Shows a single pie for each series in the chart.


Supported Series Types

  • N/A


  Element values used on the (Y Axis).

  • YValue
  • Height (2D Only)
  • Length


 Element values used on the (X Axis).

  • N/A


 Related properties:

  • Element.ForceMarker
  • Element.ExplodeSlice
  • Chart.PieLabelMode
  • Chart.ExplodedSliceAmount
  • Chart.XAxis.OrientationAngle
  • Element.Outline

 

 

Organizational

Organizational Chart Type

Shows an organizational chart based on the elements in the charts series collection.

Only Element annotations are used with this chart type. Annotation text can be specified but if left unpopulated, the element name text will be used inside the annotations.

An organizational chart has a single element at the top with no parent. Every other element will have either ParentID or Parent property set to indicate which other element it is under. All elements can be in a single series, however, the Series.Line property is used to draw connections between elements so multiple series can be used to group elements that use the same connecting line style.

Elements with no names or annotation text can be used to create more complex layouts by drawing a straight line through the location of the element as demonstrated in sample Gallery/M10

This type is explained in more detail in the Organizational Chart Tutorial.


Supported Series Types

  • N/A


  Element values used on the (Y Axis).

  • N/A


 Element values used on the (X Axis).

  • N/A


 Related properties:

  • Element.Annotation
  • Element.Parent
  • Element.InstanceID
  • Element.ParentID
  • Series.Line 

 

 

TreeMap

TreeMap Chart Type

TreeMap charts are used to display hierarchial tree structure data with nested rectangles. TreeMap charts can be created using live data or manually. The boxes support all bar shading effects and smart label layout. Series.Box can be used to control the styling and header of each series box.

This type is explained in more detail in the TreeMap Charts Tutorial.


Supported Series Types

  • N/A


  Element values used on the (Y Axis).

  • N/A


 Element values used on the (X Axis).

  • N/A


 Related properties:

  • Element.SmartLabel
  • Element.YValue
  • ChartArea.Padding
  • Series.Box
  • XAxis.Label

 

 

Surface

Surface Chart Type

The surface chart type enables visualizing 3d surface data. It provides a number of different visualizations and properties to tune them.

This type is explained in more detail in the Surface Tutorial.


Supported Series Types (SeriesTypeSurface)

  • Surface
  • Contour
  • SurfaceX
  • SurfaceY

Chart Properties

  • Chart.View3D.AngleOfTilt
  • Chart.View3D.AngleOfRotation
  • Chart.View3D.EnableLighting
  • Chart.ZAxis

Series Properties

  • Series.ZAxis
  • Series.Background
  • Series.Line


 Element values (properties) used on the (Y Axis).

  • YValue


  Element values used on the (X Axis).

  • XValue

  Element values used on the (Z Axis).

  • ZValue

 

 

 

Other chart types such as Bubble, Scatter, and Gantt are obsolete but available for legacy support. They default to Combo, Combo, and ComboHorizontal respectively and set other properties to resemble the legacy results.

ChartType.Financial is also obsolete and unnecessary. It is provided only for backward compatibility as well.

Series Types

The next major contributor to chart types is the series type. The above chart type list includes a section on supported series types for each. Different series types can be specified for each series simultaneously using the following chart types:

  • Combo
  • ComboSideBySide
  • ComboHorizontal
  • Radar(s)
  • Multiple
  • MultipleGrouped
  • Surface

This allows you to create virtually unlimited number of different chart types.

SeriesType enumeration

[C#]

mySeries.Type = SeriesType.Line;

[Visual Basic]

mySeries.Type = SeriesType.Line

 

  • Marker
    • In 3D markers have no depth
    • Related Properties
      • Element.Marker
      • Element.YValue
      • Element.YDateTime
      • Series/Element.LegendEntry.Marker

 

  • Line
    • Supported in 2D and 3D.
    • Each element can have a different color along the same line series.
    • In 2D elements will automatically show element markers.
    • Line caps can be applied to 2D lines through the Series.Line line cap properties.
    • Related Properties

 

  • Spline
    • Supported in 2D and 3D.
    • Each element can have a different color along the same spline series.
    • In 2D elements will automatically show element markers.
    • Line caps can be applied to 2D splines through the Series.Line line cap properties.
    • Related Properties

 

  • AreaLine
    • Supported in 2D and 3D.
    • Each element can have a different color along the same line series.
    • In 2D elements will automatically show element markers.
    • Supports Stacked Axis Scales.
    • Related Properties

 

  • AreaSpline
    • Supports Stacked Axis Scales.
    • Related Properties

 

  • Column & Bar
    • Supports Stacked Axis Scales.
    • Supports shading effects.
    • Supports Element.Outline
    • Supports Element.Complete indicator which is useful with Gantt charts.
    • With ComboHorizontal, gantt dependencies can be used and are defined the same way as organizational chart relationships.

 

  • Cylinder
    • Supports Stacked Axis Scales.
    • Supports Element.Outline
    • Supports 2D and 3D

 

  • Cone
    • Supports Stacked Axis Scales.
    • Supports Element.Outline

 

  • Pyramid
    • Supports Stacked Axis Scales.
    • Supports Element.Outline

 

 

  • BubbleShape
    • Requires Element.BubbleSize values.
    • Supports ShadingEffectMode.One
    • Supports 2D and 3D views.
    • Supports Element.Outline
    • Related Properties


SeriesTypeFinancial enumeration

 

[C#]

mySeries.Type = SeriesTypeFinancial.CandleStick;

[Visual Basic]

mySeries.Type = SeriesTypeFinancial.CandleStick

 

  • CandleStick
    • Element values used
      • Open or YValueStart
      • Close or YValue
      • High
      • Low
      • Complete
    • Supports column shading.
  • Bar
    • When a open value is not provided this bar will be an HLC bar, if provided it will be a OHLC.
  • Open
  • Close
  • High
  • Low
  • HighLowArea

 

SeriesTypeMultiple enumeration

 

This series type (SeriesTypeMultiple) applies to charts using ChartType.Multiple & ChartType.MultipleGrouped.

 SeriesTypeSurface enumeration

 

[C#]

mySeries.Type = SeriesTypeSurface.Contour;

[Visual Basic]

mySeries.Type = SeriesTypeSurface.Contour

 

  • Surface
    • Element values used
      • XValue, YValue, ZValue
    • Related Properties
      • Series.InterpolationFillFactor
  • Contour
    • Element values used
      • XValue, YValue, ZValue
    • Related Properties
      • Series.ContourCount
  • SurfaceX
    • Element values used
      • XValue, YValue, ZValue
  • SurfaceY
    • Element values used
      • XValue, YValue, ZValue
  • Related Properties for All Surface Types
    • Series.DefaultElement.DrawToFloor
    • Series.ZAxis
    • Series.Use3D

 

 

Axis Scales

Further customization is achieved by specifying an axis scale. Besides controlling the quantitative scale type, scales also dictate how series behave. For example an axis scale can specify that columns are stacked.

See also: Element Values & Axis Scales | Element Layout and Axes | Z Axis effect

Conclusion

As you can see, the final chart type is fundamentally based on three settings. This mix and match concept may be more complicated than a single property, however, the flexibility it provides makes it well worth understanding.

See Also
{ErrorBars and other SubValues}
{Financial Charts}
{Mapping}
{Element Layout Control}
{Element Layout Control Advanced}